import React, { useState, useEffect }  from 'react';
import {Upload,Table, Row,Col, Modal, Button, Form, Input, message,Tree} from 'antd';
import { UploadOutlined } from '@ant-design/icons';
import  {getCodeMap,importAccAndDpt}  from  '../api/dt'
import {getDataSources} from "../api/metaDatasourceService";
export  default  function CodeMapping() {
    const [data, setData] = useState([]);
    const [flag,setFlag]=useState(0);  //改变的标志
    const [type,setType]=useState([1,2,3,4,5,6]);

    useEffect(() => {
        getCodeMap().then(
            (res) => {
                setData(res.data)
            },
            (error) => {
                console.log("get UserList failed!");
            }
        );
    }, [flag]);

    const importAcc=()=>{
        importAccAndDpt().then(
            (res) => {
               message.info("同步数据已完成")
            },
            (error) => {
                message.error("同步数据失败")
            }
        );
    }

    const columns = [
        {
            title: '行政区划编码',
            dataIndex: 'postCode',
            sorter: (a, b) => a.postCode - b.postCode,
            sortDirections: ['descend'],
        },
        {
            title: '业务类型',
            dataIndex: 'businessType',
            //defaultSortOrder: 'descend',
            sorter: (a, b) => a.businessType - b.businessType,
            filters: [ {
                text: '1',
                value: 1,
            },{
                text: '2',
                value: 2,
            },{
                text: '3',
                value:3,
            },{
                text: '4',
                value: 4,
            },{
                text: '5',
                value:5,
            },{
                text: '6',
                value: 6,
            },],
            onFilter: (value, record) => record.businessType==value,
        },
        {
            title: '单位编码（账务）',
            dataIndex: 'code',
           // defaultSortOrder: 'descend',
            sorter: (a, b) => a.code - b.code,
        },
        {
            title: '名称',
            dataIndex: 'name',
            //defaultSortOrder: 'descend',
            sorter: (a, b) => a.name - b.name,
        },
        {
            title: '第三方编码',
            dataIndex: 'otherCode',
            //defaultSortOrder: 'descend',
            sorter: (a, b) => a.otherCode - b.otherCode,
        },
        // {
        //     title: '第三方名称',
        //     dataIndex: 'otherName',
        //     //defaultSortOrder: 'descend',
        //     sorter: (a, b) => a.otherName - b.otherName,
        // },
        // {
        //     title: '单位编码',
        //     dataIndex: 'orgCode',
        //     //defaultSortOrder: 'descend',
        //     sorter: (a, b) => a.orgCode - b.orgCode,
        // }
    ];


    // const data = [
    //     {
    //         key: '1',
    //         postCode: '420901',
    //         businessType: 201,
    //         code: '103014803',
    //         name:"testName1",
    //         otherCode: 'ohterCode001',
    //         otherName:"ohterName001",
    //         orgCode:"orgCode001"
    //     },
    //     {
    //         key: '2',
    //         postCode: '420902',
    //         businessType: 201,
    //         code: '103014804',
    //         name:"testName2",
    //         otherCode: 'ohterCode002',
    //         otherName:"ohterName002",
    //         orgCode:"orgCode002"
    //     },
    //     {
    //         key: '3',
    //         postCode: '420903',
    //         businessType: 201,
    //         code: '103014809',
    //         name:"testName3",
    //         otherCode: 'ohterCode003',
    //         otherName:"ohterName003",
    //         orgCode:"orgCode003"
    //     },
    //     {
    //         key: '4',
    //         postCode: '420904',
    //         businessType: 201,
    //         code: '103014804',
    //         name:"testName4",
    //         otherCode: 'ohterCode004',
    //         otherName:"ohterName004",
    //         orgCode:"orgCode004"
    //     },
    // ];

    const props = {
        name: 'file',
        action: '/reportapi/report/dt/dtCodeMapping/import',
       // accept:'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel',
        // 接受的文件类型
        accept: '.xls,.xlsx',
        headers: {
            authorization: 'authorization-text'
        },
        onChange(info) {
            if (info.file.status !== 'uploading') {
                console.log(info.file, info.fileList);
            }
            if (info.file.status === 'done') {
                setFlag(flag+1);
                message.success(`${info.file.name} file uploaded successfully`);
            } else if (info.file.status === 'error') {
                message.error(`${info.file.name} file upload failed.`);
            }
        },
    };

    function onChange(pagination, filters, sorter, extra) {
        console.log('params', pagination, filters, sorter, extra);
    }


    const exportExcel=()=>{
        const url = "/reportapi/report/dt/dtCodeMapping/exportData";
        window.open(url);
    }
    return (
        <>
            <Row>编码映射</Row>
            <Row>
                <Upload {...props}>
                    <Button icon={<UploadOutlined />}>上传Excel</Button>
                </Upload>
                <Button style={{marginLeft: 10}} key='exportExcel' onClick={exportExcel}>导出</Button>
                <Button style={{marginLeft: 10}} key='importAccAndDpt' onClick={importAcc}>同步科目表</Button>
            </Row>
            <Row>
            <Table columns={columns} dataSource={data} onChange={onChange} />
            </Row>
            </>
    );
}
